var elUsername            = document.getElementById('username'),
    elUsernameMsg         = document.getElementById('usernameMsg'),
    elPassword            = document.getElementById('password'),
    elPasswordMsg         = document.getElementById('passwordMsg'),
    elRepeatedPassword    = document.getElementById('repeatedPassword'),
    elRepeatedPasswordMsg = document.getElementById('repeatedPasswordMsg');

var usernameFlag  = false,
    passwordFlag  = false,
    repeatedFlag  = false;

var xhr  = '';



function checkUsername(username){
    if(username === null || username === '' || username.length === 0){
        elUsernameMsg.innerHTML = "<font color='orange'>请输入用户名</font>";
        usernameFlag = false;
        return;
    }

    elUsernameMsg.innerHTML = '';
    sendRequestU(username);
}

function checkPassword(password){
    if(password === null || password === '' || password.length === 0){
        elPasswordMsg.innerHTML = "<font color='orange'>请输入密码</font>";
        passwordFlag = false;
    } else if (password.length < 6){
        elPasswordMsg.innerHTML = "<font color='red'>密码长度应大于等于6位</font>";
        passwordFlag = false;
    }else{
        elPasswordMsg.innerHTML = "<font color='green'>密码合法</font>";
        passwordFlag = true;
    }
}

function checkRepeatedPassword(password,repeatedPassword){
    if(repeatedPassword === null || repeatedPassword === '' || repeatedPassword.length === 0){
        elRepeatedPasswordMsg.innerHTML = "<font color='orange'>请确认密码</font>";
        repeatedFlag = false;
    } else if(repeatedPassword === password && passwordFlag ){
        elRepeatedPasswordMsg.innerHTML = "<font color='green'>密码合法</font>";
        repeatedFlag = true;
    } else{
        elRepeatedPasswordMsg.innerHTML = "<font color='red'>新密码有误</font>";
        repeatedFlag = false;
    }
}

// function checkMyCode(myCode){
//     var respInfo = xhr2.responseXML.getElementsByTagName("Msg")[0].firstChild.data;
//     if(myCode === null || myCode === '' || myCode.length === 0){
//         elCheckCodeMsg.innerHTML = "<font color='orange'>请输入验证码</font>";
//         checkCodeFlag = false;
//     }else if(myCode == respInfo){
//         elCheckCodeMsg.innerHTML = "<font color='green'>验证码正确</font>";
//         checkCodeFlag = true;
//     }else{
//         elCheckCodeMsg.innerHTML = "<font color='red'>验证码错误</font>";
//         sendRequestUpdated();
//         checkCodeFlag = false;
//     }
//
// }

//向服务器发请求
function sendRequestU(username){
    xhr = new XMLHttpRequest();
    xhr.onreadystatechange = process;
    xhr.open('GET', 'IsUsernameExist?username=' + username, true);
    xhr.send(null);
}

// function sendRequestUpdated(){
//     xhr2 = new XMLHttpRequest();
//     xhr2.onreadystatechange = process2;
//     xhr2.open('GET', 'verificationCode', true);
//     xhr2.send(null);
// }

// function sendRequestCode(myCode){
//     xhr3 = new XMLHttpRequest();
//     xhr3.onreadystatechange = process2;
//     xhr3.open('compare', 'verificationCode', true);
//     xhr3.send(null);
// }

//回调函数（会执行4次）
function process(){
    if(xhr.readyState === 4){
        if(xhr.status === 200){
            var responseInfo = xhr.responseXML.getElementsByTagName("msg")[0].firstChild.data;
            console.log(responseInfo);
            if(responseInfo == 'Exist')
            {
                elUsernameMsg.innerHTML = "<font color='red'>用户名已存在</font>";
                usernameFlag = false;
            }else if(responseInfo == 'NotExist'){
                elUsernameMsg.innerHTML = "<font color='green'>用户名可用</font>";
                usernameFlag = true;
            }

        }
    }
}

// function process2(){
//     if(xhr2.readyState === 4){
//         if(xhr2.status === 200){
//             console.log("checkCode updated");
//         }
//     }
// }

// function process3(){
//     if(xhr2.readyState === 4){
//         if(xhr2.status === 200){
//             console.log("checkCode updated");
//             var respInfo = xhr2.responseXML.getElementsByTagName("Msg")[0].firstChild.data;
//
//         }
//     }
// }

elUsername.addEventListener('blur', function(){
    var username = elUsername.value.trim();
    checkUsername(username);
});

elPassword.addEventListener('blur', function (){
    var password = elPassword.value.trim();
    checkPassword(password);
})

elRepeatedPassword.addEventListener('blur', function (){
    var repeatedPassword = elRepeatedPassword.value.trim();
    var password = elPassword.value.trim();
    checkRepeatedPassword(password,repeatedPassword);
})

// elMyCode.addEventListener('blur', function (){
//     var myCode = elMyCode.value.trim();
//     checkMyCode(myCode);
// })

// //点击验证码修改图片
// elCheckCode.addEventListener('click', function (){
//     sendRequestUpdated();
// })